<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form>
        <tr>
            <div name="date"></div>
        </tr>

        <tr>
            <input type="button" id="start" value="开始" onclick="date_start()">
            <input type="button" id="stop" value="暂停" onclick="date_stop()" disabled="true">
        </tr>
    </form>

    <script>
        //定义全局变量作为公共定时器
        var timer
        let date_start = () => {
            let buttonStart = document.getElementById("start")
            let buttonStop = document.getElementById("stop")
            buttonStart.disabled = true
            buttonStop.disabled = false

            let date = document.getElementsByName("date")[0]
            date.innerHTML = new Date().toLocaleString()

            //返回值为一个文件描述符,表示当前定时器
            timer = window.setInterval(() => {
                date.innerHTML = new Date().toLocaleString()
            }, 1000)
            
        }

        let date_stop = () => {
            let buttonStart = document.getElementById("start")
            let buttonStop = document.getElementById("stop")
            buttonStart.disabled = false
            buttonStop.disabled = true

            //取消window定时器
            window.clearInterval(timer)
        }
    </script>
</body>

</html>